<!DOCTYPE html>
<html>
<head>
	<title>下拉菜单</title>
	<meta charset="utf-8">
	<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
</head>
<body>
	<div class="dropdown" id="mydropdown">
		<button class="btn btn-default" id="dLabel" type="button" data-toggle="dropdown">
			下拉菜单
			<span class="caret"></span>
		</button>
		<ul class="dropdown-menu" role="menu">
			<li>1</li>
			<li>1</li>
			<li>1</li>
			<li>1</li>
		</ul>
	</div>

<script type="text/javascript" src="js/jquery-3.0.0.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<script>
	$("#mydropdown").on("show.bs.dropdown",function(e){
		// 先显示弹出框，后出现下拉菜单
		alert("hello");
	})
</script>
</body>
</html>